<template>
    <div>
        <van-checkbox-group v-model="result">
            <van-cell-group>
                <van-cell
                    v-for="(item, index) in list"
                    clickable
                    :key="item.id"
                    :title="`${item['true_name']}`"
                    @click="toggle(index)"
                >
                    <template #right-icon>
                        <van-checkbox :name="item" ref="checkboxes"/>
                    </template>
                </van-cell>
            </van-cell-group>
        </van-checkbox-group>
    </div>
</template>

<script>
import {API_URL} from "@/config/urlInfo";
import {Config} from "@/config/formDataOptions";

export default {
    name: "test",
    components: {},
    data() {
        return {
            list: [],
            result: [],
        }
    },
    mounted() {
        this.onInit()
    },
    methods: {
        onInit() {
            Config.postDatas(API_URL.mobileUserSearch, {}, res => {
                this.list = res.data
            }, this)
        },
        toggle(index) {
            console.log(this.result)
            this.$refs.checkboxes[index].toggle();
        }
    }
}
</script>

<style scoped lang="less">
.search-btn {
    .van-button {
        width: 48%;
        margin-right: 1%;
    }

    background: #fff;
    text-align: center;
    padding: 11px 0;
}

.list-btn {
    .van-button {
        width: 45%;
        margin-right: 2%;
        float: right;
    }
}

.wt-card {
    margin: 0.4rem;
    background: #fff;
    overflow: hidden;
    border-radius: 0.3rem;
    padding: 0.4rem;
    box-shadow: 0 0 0.2rem #ccc;
    border-bottom: 0.1rem solid #ccc;
}


.icons-warp {
    border-radius: 25px;

    .float-icon-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: relative;
        width: 50px;
        height: 50px;

        img {
            width: 25px;
            height: 25px;
            margin-bottom: 3px;
        }

        span {
            font-size: 9px;
            color: #666666;
        }
    }
}


</style>